<template>
<div>
 <el-checkbox-group v-model="value" @change="change" v-bind="elProps">
    <el-checkbox  v-for="city in options" :key="city" :label="city"  v-bind="elProps" >
      {{city}}
    </el-checkbox>
  </el-checkbox-group>
</div>
</template>

<script setup>
import { ref,watch } from 'vue' 
const props = defineProps({
  modelValue:Array,
  elProps:Object,
  options:Array
})
const value = ref([])
watch(()=>props.modelValue,(newval)=>{
value.value = newval
})
value.value = props.modelValue

const emit = defineEmits(['update:modelValue'])
const change = ()=>{
  emit('update:modelValue',value.value)
}
</script>
<style lang='scss' scoped>

</style>